<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<title>矩形</title>
	<style type="text/css">
		canvas{
			margin-top: 100px;
			border:1px solid red;
		}
	</style>
</head>
<body>
<canvas width="500" height="500" id="can">您的浏览器版本太低，不支持画布，请升级您的浏览器</canvas>
<script type="text/javascript">
	// 获取画布
	var can=document.getElementById("can");
	// 获取画笔
	var pen=can.getContext("2d");
	pen.rect(100,100,200,200);
	pen.lineWidth="10";
	pen.strokeStyle="red";
	pen.fillStyle="green";
	pen.fill();
	 pen.clearRect(150,150,60,60);
	pen.stroke();





</script>





</body>
</html>